import React from "react";

import { Row, Col, Tag, Button } from "antd";

class Detail extends React.Component {
    render() {
        return <div>
                   <Row>
                       <Col span={ 12 }>
                       <div className="title">车辆基本信息</div>
                       </Col>
                       <Col span={ 12 } className="ta-r">
                       <Tag>标签1</Tag>
                       <Tag>标签2</Tag>
                       <Button size="small" type="primary">编辑车辆标签</Button>
                       </Col>
                   </Row>
                   <div className="detail-panel mt10">
                       <div className="body">
                           <Row>
                               <Col span={ 8 } className="item">
                               <span className="label">牌照号：</span>
                               <span className="value">川A454E2</span>
                               </Col>
                               <Col span={ 8 } className="item">
                               <span className="label">车辆型号：</span>
                               <span className="value">黄海e2016<Button type="primary" size="small" className="ml10">车型详情</Button></span>
                               </Col>
                               <Col span={ 8 } className="item">
                               <span className="label">当前用户：</span>
                               <span className="value">张琪</span>
                               </Col>
                           </Row>
                           <Row>
                               <Col span={ 8 } className="item">
                               <span className="label">终端号：</span>
                               <span className="value">tk_car_154</span>
                               </Col>
                               <Col span={ 8 } className="item">
                               <span className="label">车辆性质：</span>
                               <span className="value">非运营</span>
                               </Col>
                               <Col span={ 8 } className="item">
                               <span className="label">当前用户手机号：</span>
                               <span className="value">13113654888</span>
                               </Col>
                           </Row>
                           <Row>
                               <Col span={ 8 } className="item">
                               <span className="label">车架号号：</span>
                               <span className="value">TK154FDAF542F45D515524D5</span>
                               </Col>
                               <Col span={ 8 } className="item">
                               <span className="label">车辆状况：</span>
                               <span className="value">在线</span>
                               </Col>
                               <Col span={ 8 } className="item"> </Col>
                           </Row>
                           <Row>
                               <Col span={ 24 } className="item">
                               <span className="label">备注：</span>
                               <span className="value">上次检修时间2016年02月15日，下次检修计划在2017年6月前完成</span>
                               </Col>
                           </Row>
                       </div>
                   </div>
                   <Row className="mt20">
                       <Col span={ 12 }>
                       <div className="title">车辆-设备信息</div>
                       </Col>
                   </Row>
                   <div className="detail-panel mt10">
                       <div className="header">
                           整车控制器
                       </div>
                       <div className="body">
                           <Row>
                               <Col span={ 8 } className="item">
                               <span className="label">设备厂家：</span>
                               <span className="value">湖北三环<Button type="primary" size="small" className="ml10">供应商信息</Button></span>
                               </Col>
                               <Col span={ 8 } className="item">
                               <span className="label">型号：</span>
                               <span className="value">GJ52-145</span>
                               </Col>
                               <Col span={ 8 } className="item">
                               <span className="label">产品名称：</span>
                               <span className="value">整车控制器</span>
                               </Col>
                           </Row>
                       </div>
                   </div>
                   <div className="detail-panel mt20">
                       <div className="header">
                            电机控制器
                       </div>
                       <div className="body">
                           <Row>
                               <Col span={ 8 } className="item">
                               <span className="label">设备厂家：</span>
                               <span className="value">湖北三环<Button type="primary" size="small" className="ml10">供应商信息</Button></span>
                               </Col>
                               <Col span={ 8 } className="item">
                               <span className="label">型号：</span>
                               <span className="value">GJ52-145</span>
                               </Col>
                               <Col span={ 8 } className="item">
                               <span className="label">产品名称：</span>
                               <span className="value">E-motor W450</span>
                               </Col>
                           </Row>
                       </div>
                   </div>
                   <div className="detail-panel mt20">
                       <div className="header">
                           电池管理系统
                       </div>
                       <div className="body">
                           <Row>
                               <Col span={ 8 } className="item">
                               <span className="label">设备厂家：</span>
                               <span className="value">湖北三环<Button type="primary" size="small" className="ml10">供应商信息</Button></span>
                               </Col>
                               <Col span={ 8 } className="item">
                               <span className="label">型号：</span>
                               <span className="value">GJ52-145</span>
                               </Col>
                               <Col span={ 8 } className="item">
                               <span className="label">产品名称：</span>
                               <span className="value">BMS CAN32-2016</span>
                               </Col>
                           </Row>
                       </div>
                   </div>
                   <div className="mt30">
                        <Button type="primary" size="large" style={ { width: "160px" } }>编辑</Button><Button size="large" className="ml10 gray">删除</Button>
                   </div>
               </div>
    }
}

export default Detail;